<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="/admin/static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="/admin/lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/css/style.css" />
    <link rel="stylesheet" type="text/css" href="/webuploader/webuploader.css" />

    <title>添加房源 - 房源管理 - H-ui.admin v3.1</title>
</head>
<body>
<article class="page-container">
    @include('admin.common.validate')
    <form  class="form form-horizontal" action="{{ route('admin.fang.update',$fang) }}" method="post" id="form-admin-add">
        {{ method_field('PUT') }}

        {{ csrf_field() }}
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>房源名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" name="fang_name" value="{{ $fang->fang_name }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>小区名称：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" name="fang_xiaoqu" value="{{ $fang->fang_xiaoqu }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>小区地址：</label>
            <div class="formControls col-xs-4 col-sm-4">
                <select id="fang_province" name="fang_province" class="input-text style=" style=width:130px;" onchange="selectCity(this,'fang_city')">
                    <option value="0">--请选择--</option>
                    @foreach($cityData as $item)
                        <option @if($item->id==$fang->fang_province) selected @endif value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
                <select id="fang_city" name="fang_city" class="input-text "  style="width:130px" onchange="selectCity(this,'fang_region')">
                    <option value="0">--市--</option>
                    @foreach($currentCityData as $item)
                        <option @if($item->id==$fang->fang_city) selected @endif value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
                <select id="fang_region" name="fang_region" class="input-text "  style="width:130px">
{{--                    <option value="0">--区/县--</option>--}}
                    @foreach($currentRegionData as $item)
                        <option @if($item->id==$fang->fang_region) selected @endif value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="formControls col-xs-4 col-sm-5">
                <input type="text" class="input-text" name="fang_addr" value="{{ $fang->fang_addr }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>租金：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" name="fang_rent" value="{{ $fang->fang_rent }}" style="width:150px" />  &nbsp;元
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>付款方式：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select name="fang_region" class="input-text "  style="width:200px">
                    @foreach($fang_rent_type_data as $item)
                        <option @if($item->id == $fang->fang_region) selected @endif  value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>楼层：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text" name="fang_floor" value="{{ $fang->fang_floor }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>几室：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text " name="fang_shi" value="{{ $fang->fang_shi }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>几厅：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text" name="fang_ting" value="{{ $fang->fang_ting }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>几卫：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text" name="fang_wei" value="{{ $fang->fang_wei }}"/>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>朝向：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select id="fang_direction" name="fang_direction" class="input-text "  style="width:200px">
                    @foreach($fang_direction_data as $item)
                        <option @if($item->id == $fang->fang_direction) selected @endif  value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>租赁方式：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select name="fang_rent_class" class="input-text "  style="width:200px">
                    @foreach($fang_rent_class_data as $item)
                        <option @if($item->id == $fang->fang_rent_class) selected @endif  value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>建筑面积：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text " name="fang_build_area" value="{{ $fang->fang_build_area }}"/> 平米
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>使用面积：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="number" class="input-text " name="fang_using_area" value="{{ $fang->fang_using_area }}"/> 平米
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>建筑年代：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" onfocus="WdatePicker({dateFmt:'yyyy'})" id="datemin" name="fang_year" value="{{ $fang->fang_year }}" class="input-text Wdate" style="width:120px;">
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>配套设施：</label>
            <div class="formControls col-xs-8 col-sm-9">
                @foreach($fang_config_data as $item)
                    <label>
                        <input @if(in_array($item->id,$fang->fang_conf)) checked @endif type="checkbox" name="fang_config[]" value="{{ $item->id }}">
                        {{ $item->name }} &nbsp;&nbsp;&nbsp;
                    </label>
                @endforeach
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>房屋图片：</label>
            <div class="formControls col-xs-2 col-sm-2">
                <div id="picker">房屋图片</div>
            </div>
            <div class="formControls col-xs-6 col-sm-7">
                <!-- 表单提交时，上传图片地址，以#隔开 -->
                <input type="hidden" name="fang_pic" id="fang_pic"/>
                <!-- 显示上传成功后的图片容器 -->
                <div id="imglist">{!! $fang->images !!}</div>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>业主：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select name="fang_owner" class="input-text "  style="width:200px">
                    @foreach($ownerData as $item)
                        <option @if($item->id == $fang->fang_owner) selected @endif  value="{{ $item->id }}">{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>是否推荐：</label>
            <div class="formControls col-xs-8 col-sm-9 skin-minimal">
                <div class="radio-box">
                    <label for="sex-2">
                        <input type="radio" id="sex-2" name="is_recommend" value="0" @if($fang->is_recommend == 0) checked @endif>
                        不推荐</label>
                </div>
                <div class="radio-box">
                    <label for="sex-1">
                        <input name="is_recommend" type="radio" id="sex-1" value="1" @if($fang->is_recommend == 1) checked @endif>
                        推荐</label>
                </div>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>房屋描述：</label>
            <div class="formControls col-xs-8 col-sm-9">

                <textarea  name="fang_desn"  class="textarea" >{{$fang->fang_desn}}</textarea>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>房屋详情：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <textarea id="fang_body"  name="fang_body">{{ $fang->fang_body }}</textarea>
            </div>
        </div>

        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;添加房源&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="/admin/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="/admin/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="/ueditor/ueditor.all.js"></script>
<script type="text/javascript" src="/webuploader/webuploader.js"></script>
<script type="text/javascript" src="/admin/static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="/admin/static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->
<script type="text/javascript" src="/admin/lib/My97DatePicker/4.8/WdatePicker.js"></script>

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript">
    //富文本
    var ue = UE.getEditor('fang_body',{
        initialFrameHeight:200
    })


    //地区三级联动
    function selectCity (obj,selectName){
        let value = $(obj).val();
        $.get('{{ route('admin.fang.city') }}',{id:value}).then(jsonArr=>{
            let html = '<option value="0">--请选择--</option>';
            jsonArr.map(item=>{
                var {id,name} = item;
                html += `<option value=" ${id} "> ${name} </option>`
            })
            $('#'+ selectName).html(html);
        })
    }


    //表单验证提交
    $("#form-admin-addss").validate({
        rules:{
            fang_name:{
                required:true,
            },
            fang_xiaoqu:{
                required:true,
            },
            fang_add:{
                required:true,
            },
            fang_province:{
                min:1
            },
            fang_ting:{
                min:1
            },
            fang_region:{
                min:1
            },
            fang_rent:{
                required:true,
                number:true
            },
            fang_floor:{
                number:true
            },
            fang_year:{
                required:true,
            },
            fang_desn:{
                required:true,
            },


        },
        messages:{
            fang_name:{
                required:'房源名称不能为空'
            },
            fang_xiaoqu:{
                required:'小区名称不能为空'
            },
            fang_add:{
                required:'地址不能为空'
            },
            fang_province:{
                min:''
            },
            fang_ting:{
                min:''
            },
            fang_region:{
                min:''
            },
            fang_rent:{
                number:'只能输入数字'
            },
            fang_floor:{
                number:'只能输入数字'
            },
            fang_year:{
                required:'年份不能为空'
            },
            fang_desn:{
                required:'描述不能为空'
            },
        },
        //取消键盘事件
        onkeyup:false,
        focusCleanup:true,
        success:"valid",
        submitHandler: function (form) {
            // // 表单提交地址
            // let url = $(form).attr('action');
            // // 表单序列化   _token=aaa&name=fewflew
            // let data = $(form).serialize();
            //
            // // jquery post提交
            // $.post(url,data).then(({status,msg})=>{
            //     if(status == 0){
            //         layer.msg(msg,{icon:1,time:2000},()=>{
            //             var index = parent.layer.getFrameIndex(window.name);
            //             parent.$('.btn-refresh').click();
            //             parent.layer.close(index);
            //         })
            //     }else{
            //         layer.msg(msg,{icon:2,time:2000})
            //     }
            // })
            $(form).ajaxSubmit();
        }
    });


    //文件上传
    var uploader = WebUploader.create({
        //自动上传
        auto:true,
        //swf路径
        swf:'/webuploader/uploader.swf',
        server:'{{ route('admin.fangowner.upfile') }}',
        formData:{
            _token:'{{ csrf_token() }}'
        },
        //文件表单名称
        fileVal:'file',
        pick:{
            id:'#picker',
            //是否上传多个
            multiple:true
        },
        //压缩
        resize:true
    });
    //上传成功回调
    uploader.on('uploadSuccess', function (file, ret) {
        // 解决表单提交时，图片以#隔开解决
        let val = $('#fang_pic').val();
        let tmp = val + '#' + ret.url;
        $('#fang_pic').val(tmp);
        // 图片显示
        let imglist = $('#imglist');
        // 注：一定要用追加还是不html覆盖
        let html = `
            <div style="position: relative;;width:100px;">
                <img src="${ret.url}" style="width:100px;" />
                <strong onclick="delpic(this,'${ret.url}')" style="position: absolute;right: 2px;top: 2px;color:white;font-size: 20px;">X<strong>
            </div>
        `;
        imglist.append(html);
    });

    //删除图片
    function delpic(obj,picurl){
        let url = "{{ route('admin.fangowner.delfile') }}?file="+picurl;
        //发起请求删除
        fetch(url);
        //删除当前点击图片显示
        $(obj).parent().remove();
        //修改隐藏域表单
        $('#fang_pic').val($('#fang_pic').val().replace(`#${picurl}`,''));
    }


    // 单选框样式
    $('.skin-minimal input').iCheck({
        checkboxClass: 'icheckbox-blue',
        radioClass: 'iradio-blue',
        increaseArea: '20%'
    });




    // var index = parent.layer.getFrameIndex(window.name);
    // parent.$('.btn-refresh').click();
    // // parent.layer.close(index);
</script>
</body>
</html>